<template>
	<view>
		<!-- 顶部栏位 -->
		<u-navbar class="navbar" :border-bottom="false" title="库存维护" :title-size="36" :title-bold="true" :title-color="textColor">
		</u-navbar>
		<view style="height: 70rpx;"></view>
		<!-- 头部内容 -->
		<view class="u-text-center u-flex u-flex-col">
			<image :src="info.url?info.url:(resourcesUrl + info.resourceId)" style="width: 100rpx;height: 100rpx;border-radius: 10rpx;" mode=""></image>
			<text class="u-m-t-30">{{ info.name }}</text>
			<text class="u-m-t-42 u-font-26 grey-color">当前库存（{{info.unit}}）</text>
			<text style="font-size: 44rpx;">{{ info.inventoryBalance }}</text>
		</view>
		<!-- 改变区域 -->
		<view class="u-m-t-40 box-padding">
			<view class="item u-flex u-p-b-30 u-row-between">
				<view>停售</view>
				<u-switch  v-model="info.isHaltSale" active-color="#FFBB1A" inactive-color="#CCC"></u-switch>
				
			</view>
			<view class="item">
				<text>目标库存</text>
				<view class="u-flex u-row-between u-m-30 u-text-center">
					<!-- <view class="jisuan">-</view> -->
					<image src="/static/common/jian.png" style="width: 32rpx;height: 32rpx;" mode="" @click="changeMubiao(-step)"></image>
					<input type="number" v-model="mubiao" @blur="changeMubiao" :confirm-hold="false" @confirm="changeMubiao">
					<image src="/static/common/jia.png" style="width: 32rpx;height: 32rpx;" mode="" @click="changeMubiao(step)"></image>
				</view>
			</view>
			<view class="item">
				<text>库存变量</text>
				<view class="u-flex u-row-between u-m-30 u-text-center">
					<!-- <view class="jisuan">-</view> -->
					<image src="/static/common/jian.png" style="width: 32rpx;height: 32rpx;" mode="" @click="changeBianliang(-step)"></image>
					<input type="number" v-model="bianliang" @blur="changeBianliang" :confirm-hold="true" @confirm="changeBianliang">
					<image src="/static/common/jia.png" style="width: 32rpx;height: 32rpx;" mode="" @click="changeBianliang(step)"></image>
				</view>
			</view>
			<view class="item">
				<text>分类</text>
				<view class="u-m-b-30 u-m-t-30">
					<view class="u-flex u-row-between" @tap="$mRouter.push({ route: '/pages/sale/classManger/index?type=Seller&isChoose=true&name='+info.shopCategoryName+'&id='+info.shopCategoryId })">
						<view class="u-line-1" style="max-width: 400rpx;">
							<text v-if="info.shopCategoryName!=='null'&&info.shopCategoryName!==null&&info.shopCategoryName!==''">{{info.shopCategoryName}}</text>
							<text v-else style="color:#999;">请选择店内分类</text>
							
						</view>
						<u-icon name="arrow-right"></u-icon>
					</view>
				</view>
			</view>
			<view class="item">
				<text>最小销售单位
					<text style="color: #FF551A;">{{info.unit!=null&&info.unit!='null'?'('+info.unit+')':''}}</text>
				</text>
				<view class="u-m-b-30 u-m-t-30">
					<input v-model="info.sellingUnit" type="text" placeholder="请输入最小销售单位" placeholder-style="color:#999999;font-size: 30rpx;">
				</view>
			</view>
			<view class="item">
				<text>库存下限</text>
				<view class="u-m-b-30 u-m-t-30">
					<input v-model="info.lowerLimitBalance" type="text" placeholder="请输入库存下限" placeholder-style="color:#999999;font-size: 30rpx;">
				</view>
			</view>
			<view class="item">
				<text>库存上限</text>
				<view class="u-m-b-30 u-m-t-30">
					<input v-model="info.uupperLimitBalance" type="text" placeholder="请输入库存上限" placeholder-style="color:#999999;font-size: 30rpx;">
				</view>
			</view>
			<view class="item">
				<text>商品编码</text>
				<view class="u-m-b-30 u-m-t-30">
					<input v-model="info.externaItemId" type="text" placeholder="请输入商品编码" placeholder-style="color:#999999;font-size: 30rpx;">
				</view>
			</view>
			<view class="item">
				<text>摘要</text>
				<view class="u-m-b-30 u-m-t-30">
					<input v-model="info.remarks" type="text" placeholder="请输入库存变化摘要" placeholder-style="color:#999999;font-size: 30rpx;">
				</view>
			</view>
		</view>
		<!-- 提交按钮 -->
		<set-submit-bt text="确定" cancaelText="删除" @click="handleSubmit" @cancel="delModel=true" :isBtnGroup="true"></set-submit-bt>
		<u-modal v-model="delModel" :content="content" @confirm="delInventory"></u-modal>
		<akLoading isFullScreen :active="loading"></akLoading>
	</view>
</template>

<script>
	import SetSubmitBt from '@/components/set-submit-bt';
	import { useShopStore } from '@/store/shop.js';
	import { useUserStore } from '@/store/user.js';
	
	import { mapState } from 'pinia';
	export default {
		components: { SetSubmitBt },
		data() {
			return {
				loading:false,
				itemId: null,
				inventoryId: null,
				resourceId: '',
				abbreviation: '',
				inventoryBalance:1,
				remarks: '',
				info: {},
				mubiao: undefined,
				bianliang: undefined,
				step: 100,
				searchClass:{
					name:'',
					id:''
				},
				delModel:false,
				content:'您确定要删除此库存吗？'
			}
		},
		computed:{
			...mapState(useShopStore, {storeShop: 'shop'}),
			...mapState(useUserStore, ['isSale'])
		},
		onLoad(option) {
				this.inventoryId = option.inventoryId;
				this.getInventoryById();
			// this.info = option;
			// this.info.remarks = option.remarks == 'null' ? '' : option.remarks;
			// if(option.isHaltSale === 'true'){
			// 	this.info.isHaltSale = true;
			// }
			// if(option.isHaltSale === 'false'){
			// 	this.info.isHaltSale = false;
			// }
			// console.log(this.info);
			// if (option.inventoryId != 'null') {
			// 	this.inventoryId = option.inventoryId
			// 	this.getInventoryById()
			// } else {
			// 	this.itemId = option.itemId
			// 	this.inventoryBalance = Number(option.inventoryBalance)
			// }
			// this.mubiao = option.inventoryBalance;
			// this.bianliang = 0
		},
		onShow() {
			uni.$off('sendClassData')//建议先销毁一次监听，再进行新的一次监听，否则会出现重复监听的现象
			let that = this;
			uni.$once('sendClassData',function(data){
					//这的data就是B页面传递过来的数据
					that.info.shopCategoryName=data.name===''?'选择分类':data.name;
					that.info.shopCategoryId=data.id===''?'':data.id;
			})
		},
		methods: {
			async delInventory(){
				console.log('cancel');
				this.loading = true;
				let params = {
					itemId:this.info.itemId,
					shopId:this.storeShop.id
				};
				const res = await this.$newHttp.delete('api/Seller/DeleteShopInventory', params);
				this.loading = false;
				if(res.code === 200){
					this.$u.toast('删除成功', 1000, 'success')
					this.$mHelper.delayedJump('/pages/sale/kucun/index', 'redirectTo')
				}else{
					this.$u.toast('获取库存详情失败，错误信息：'+res.erroMessage);
				}
			},
			async getInventoryById() {
				this.loading = true;
				const res = await this.$newHttp.get('api/Seller/GetShopInventory', { params: { id: this.inventoryId,shopId:this.storeShop.id } });
				this.loading = false;
				if(res.code === 200){
					this.info = this.$u.deepClone(res.data);
					this.inventoryBalance = Number(res.data.inventoryBalance);
					this.mubiao = res.data.inventoryBalance;
					this.bianliang = 0;
					console.log(this.info);
				}else{
					this.$u.toast('获取库存详情失败，错误信息：'+res.erroMessage);
				}
			},
			changeMubiao(step) {
				uni.hideKeyboard()
				this.mubiao = Number(this.mubiao == undefined ? 0 : this.mubiao)
				if (typeof step == 'number') {
					if (this.mubiao + step <= 99) {
						this.bianliang = -this.inventoryBalance
						this.mubiao = 0
						return this.$u.toast('目标库存最低数量为0')
					}
					this.mubiao += step
				}
				if (this.mubiao < 0) {
					this.mubiao = 0
					this.bianliang = -this.inventoryBalance
					return this.$u.toast('目标库存最低数量为0')
				}
			
				this.bianliang = this.mubiao - this.inventoryBalance
			},
			changeBianliang(step) {
				uni.hideKeyboard()
				this.bianliang = Number(this.bianliang == undefined ? 0 : this.bianliang)
				if (typeof step == 'number') {
					if (this.bianliang + step < -this.inventoryBalance) {
						this.bianliang = -this.inventoryBalance
						return this.$u.toast('目标库存最低数量为0')
					}
					this.bianliang += step
				}
				const mubiao = this.inventoryBalance + this.bianliang
				if (mubiao < 0) {
					this.bianliang = -this.inventoryBalance
					this.mubiao = 0
					return this.$u.toast('目标库存最低数量为0')
				}
				this.mubiao = mubiao
			},
			async handleSubmit() {
				this.loading = true;
				if(!this.isSale){
					this.loading = false;
					return this.$u.toast('当前账号没有维护库存的权限')
				}
				if (this.mubiao < 0) {
					this.loading = false;
					return this.$u.toast('目标库存最低数量为0')
				}
				// this.info.inventoryBalance = this.mubiao ? this.mubiao : this.inventoryBalance; //修改前，2023-11-15
				this.info.inventoryBalance = this.mubiao; //2023-11-15 上午 由燕姐提出，子夜拿手机操作，发现APP设置库存不能为0，（暂做修改）
				if (this.inventoryId){
					this.info.id = this.inventoryId
				} else{
					this.info.id = ''
				}
				let ary = [];
				ary.push(this.info);
				let params = {
					shopId:this.storeShop.id,
					inventories:ary
				}
				// const res = await this.$http.post('api/Shop/SaveShopInventory', this.info)
				const res = await this.$newHttp.post('api/Seller/SaveShopInventories', params);
				this.loading = false;
				if (res.code === 200) {
					this.$u.toast('维护成功', 1000, 'success')
					this.$mHelper.delayedJump('/pages/sale/kucun/index', 'redirectTo')
				}else{
					this.$u.toast('维护库存失败，错误信息：'+res.erroMessage);
				}
				
			}
		}
	}
</script>

<style>
	page {
		background-color: #FFFFFF;
	}
</style>
<style lang="scss" scoped>
	.item {
		// padding: 30rpx 0;
		padding-top: 30rpx;
		border-bottom: 2rpx solid #F3F3F3;
	}
</style>
